// 块代码，使用gyk-div
$namespace: "gyk" !default;
$block-sel: "-" !default;
$elem-sel: "__" !default;
$mod-sel: "--" !default;

@mixin bfc {
  height: 100%;
  overflow: hidden;
}

@mixin boxCenter {
  margin: 50% 0 0 50%;
  transform: translate(-50%, -50%);
}

// 块代码样式
@mixin b($block) {
  $B: $namespace + $block-sel + $block;
  .#{$B} {
    @content;
  }
}

// 元素代码样式
@mixin e($el) {
  $selector: &;
  // 跳出嵌套
  @at-root {
    #{ $selector + $elem-sel + $el } {
      @content;
    }
  }
}

// 修饰代码样式
@mixin m($m) {
  $selector: &;
  // 跳出嵌套
  @at-root {
    #{ $selector + $mod-sel + $m } {
      @content;
    }
  }
}

// flex row center组合
@mixin frc {
  display: flex;
  align-items: center;
  flex-direction: row;
}

@mixin fcc {
  display: flex;
  align-items: center;
  flex-direction: column;
}

// 动画
@mixin trans {
  transition: all 0.1s;
}